import 'package:flutter/material.dart';

class TagStepper extends StatefulWidget {
  final int count;
  final double size;
  final double numberSize;
  final Axis axis;
  final Color? activeForegroundColor;
  final Color? activeBackgroundColor;
  final Color? deActiveForegroundColor;
  final Color? deActiveBackgroundColor;
  final Function(int count)? didChangeCount;

  const TagStepper(
      {Key? key,
      this.count = 0,
      this.activeForegroundColor,
      this.didChangeCount,
      this.activeBackgroundColor,
      this.deActiveForegroundColor,
      this.deActiveBackgroundColor,
      this.size = 50.0,
      this.axis = Axis.horizontal,
      this.numberSize = 2})
      : super(key: key);
  @override
  State<TagStepper> createState() => _TagStepperState();
}

class _TagStepperState extends State<TagStepper> {
  @override
  Widget build(BuildContext context) {
    List<Widget> childs = [
      Expanded(
        child: IconButton(
          iconSize: widget.size * 0.6,
          padding: EdgeInsets.all(widget.size * 0.2),
          icon: Icon(
            Icons.add,
            color: widget.count != 0 ? Colors.white : Colors.black,
          ),
          onPressed: () {
            widget.didChangeCount!(widget.count + 1);
          },
        ),
      )
    ];
    if (widget.count > 0) {
      childs.add(SizedBox(
        width: widget.axis == Axis.vertical
            ? widget.size
            : widget.size * widget.numberSize * .5,
        child: Center(
          child: Text(
            widget.count.toString(),
            softWrap: false,
            style: TextStyle(
              color: const Color(0xffffffff),
              fontWeight: FontWeight.w400,
              fontFamily: "Quicksand",
              fontStyle: FontStyle.normal,
              fontSize: widget.size * 0.5,
            ),
          ),
        ),
      ));
      childs.add(Expanded(
        child: IconButton(
            iconSize: widget.size * 0.6,
            padding: EdgeInsets.all(widget.size * 0.2),
            icon: const Icon(
              Icons.remove,
              color: Colors.white,
            ),
            onPressed: () {
              setState(() {
                if (widget.count != 0) {
                  widget.didChangeCount!(widget.count - 1);
                }
              });
            }),
      ));
    }

    double width = widget.size;
    double height = width;
    if (widget.count > 0) {
      if (widget.axis == Axis.vertical) {
        height *= 2 + widget.numberSize * .5;
      } else {
        width *= 2 + widget.numberSize * .5;
      }
    }

    return AnimatedContainer(
      width: width,
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(widget.size * 0.5),
          boxShadow: const [
            BoxShadow(
              color: Colors.black26,
              blurRadius: 5.0,
            ),
          ],
          color:
              widget.count != 0 ? widget.activeForegroundColor : Colors.white),
      height: height,
      duration: const Duration(milliseconds: 300),
      curve: Curves.easeIn,
      child: widget.axis == Axis.vertical
          ? Column(
              children: childs,
            )
          : Row(
              children: childs.reversed.toList(),
            ),
    );
  }
}
